<template>

    <div class="app-container" v-if="canList">
        <div class="filter-container">
            <el-input @keyup.enter.native="handleFilter" style="width: 200px;" class="filter-item input"
                      placeholder="名称"
                      v-model="listQuery.entity.user.name">
            </el-input>

          <el-input @keyup.enter.native="handleFilter" style="width: 200px;" class="filter-item input"
                    placeholder="门店名称"
                    v-model="listQuery.entity.user.shopName">
          </el-input>


          <el-input @keyup.enter.native="handleFilter" style="width: 200px;" class="filter-item input"
                    placeholder="连锁名称"
                    v-model="listQuery.entity.user.linkName">
          </el-input>


            <el-input @keyup.enter.native="handleFilter" style="width: 200px;" class="filter-item input"
                      placeholder="手机号码"
                      v-model="listQuery.entity.user.mobile">
            </el-input>


          <el-input @keyup.enter.native="handleFilter" style="width: 200px;" class="filter-item input"
                    placeholder="省"
                    v-model="listQuery.entity.user.province">
          </el-input>


          <el-input @keyup.enter.native="handleFilter" style="width: 200px;" class="filter-item input"
                    placeholder="市"
                    v-model="listQuery.entity.user.city">
          </el-input>


          <el-input @keyup.enter.native="handleFilter" style="width: 200px;" class="filter-item input"
                    placeholder="县"
                    v-model="listQuery.entity.user.county">
          </el-input>


            <el-select @change='handleFilter' clearable class="filter-item input" style="width: 130px"
                       v-model="listQuery.entity.user.levelId"
                       placeholder="用户身份">
                <el-option v-for="(item) in  levels" :key="item.id" :label="item.name" :value="item.id">
                </el-option>
            </el-select>

            <el-input @keyup.enter.native="handleFilter" style="width: 200px;" class="filter-item input"
                      placeholder="编码"
                      v-model="listQuery.entity.user.code">
            </el-input>
            <el-input @keyup.enter.native="handleFilter" style="width: 200px;" class="filter-item input"
                      placeholder="上级编号"
                      v-model="listQuery.entity.top.code">
            </el-input>
          <el-input @keyup.enter.native="handleFilter" style="width: 200px;" class="filter-item input"
                    placeholder="上级名字"
                    v-model="listQuery.entity.top.name">
          </el-input>



            <el-select @change='handleFilter' clearable class="filter-item input" style="width: 130px"
                       v-model="listQuery.entity.user.status"
                       placeholder="状态">
                <el-option v-for="(item,index) in  statusOptions" :key="item" :label="item" :value="index">
                </el-option>
            </el-select>

          <el-select @change='handleFilter' clearable class="filter-item input" style="width: 130px"
                     v-model="listQuery.entity.user.vip"
                     placeholder="兑费">
            <el-option v-for="(item,index) in  vipOptions" :key="item" :label="item" :value="index">
            </el-option>
          </el-select>
            <el-date-picker
                    value-format="yyyy-MM-dd HH:mm:ss"
                    class="filter-item input"
                    v-model="listQuery.entity.user.registerTimes"
                    type="datetimerange"
                    range-separator="至"
                    start-placeholder="变动时间开始日期"
                    end-placeholder="变动时间结束日期">
            </el-date-picker>
<!--            <el-date-picker-->
<!--                    class="filter-item input"-->
<!--                    v-model="listQuery.entity.user.joinDates"-->
<!--                    type="datetimerange"-->
<!--                    range-separator="至"-->
<!--                    start-placeholder="加入时间开始日期"-->
<!--                    end-placeholder="加入时间结束日期">-->
<!--            </el-date-picker>-->

            <div style="display: inline-block">

                <el-button style="margin-left: 10px;" class="filter-item" type="primary" v-waves icon="el-icon-search"
                           @click="handleFilter">查找
                </el-button>

              <el-button style="margin-left: 10px;" class="filter-item" type="primary" v-waves
                         @click="handleVip">兑费切换
              </el-button>

              <el-button class="filter-item" type="primary" :loading="downloadLoading" v-waves icon="el-icon-download"
                         @click="handleDownload">导出
              </el-button>

            </div>
        </div>

        <el-table :key='tableKey' :data="list" v-loading="listLoading" border fit highlight-current-row
                  style="width: 100%;">

            <el-table-column align="center" label="头像">
                <template slot-scope="scope">
                    <img style="height: 50%;width: 50%" :src="scope.row.user.avatar">
                </template>
            </el-table-column>

            <el-table-column align="center" label="名称">
                <template slot-scope="scope" >
                    <span>{{scope.row.user.name}}-{{scope.row.user.code}}</span>
                </template>
            </el-table-column>


            <el-table-column align="center" label="手机号码">
                <template slot-scope="scope">
                    <span>{{scope.row.user.mobile}}</span>
                </template>
            </el-table-column>

            <el-table-column align="center" label="身份">
                <template slot-scope="scope" v-if="scope.row.level">
                    <span>{{scope.row.level.name}}</span>
                </template>
            </el-table-column>

            <el-table-column align="center" label="上级">
                <template slot-scope="scope" v-if="scope.row.top">
                    <span>{{scope.row.top.name}}-{{scope.row.top.code}}</span>
                </template>
            </el-table-column>

          <el-table-column align="center" label="生日">
            <template slot-scope="scope">
              <span>{{parseTime(scope.row.user.birth)}}</span>
            </template>
          </el-table-column>

          <el-table-column align="center" label="门店名称">
            <template slot-scope="scope">
              <span>{{scope.row.user.shopName}}</span>
            </template>
          </el-table-column>


          <el-table-column align="center" label="连锁名称">
            <template slot-scope="scope">
              <span>{{scope.row.user.linkName}}</span>
            </template>
          </el-table-column>


          <el-table-column align="center" label="省">
            <template slot-scope="scope">
              <span>{{scope.row.user.province}}</span>
            </template>
          </el-table-column>

          <el-table-column align="center" label="市">
            <template slot-scope="scope">
              <span>{{scope.row.user.city}}</span>
            </template>
          </el-table-column>


          <el-table-column align="center" label="县">
            <template slot-scope="scope">
              <span>{{scope.row.user.county}}</span>
            </template>
          </el-table-column>

            <div class="shop" v-if="listQuery.entity.user.levelId===1">
<!--                <el-table-column align="center" label="连锁名称">-->
<!--                    <template slot-scope="scope">-->
<!--                        <span>{{scope.row.user.linkName}}</span>-->
<!--                    </template>-->
<!--                </el-table-column>-->

<!--                <el-table-column align="center" label="药店代码">-->
<!--                    <template slot-scope="scope">-->
<!--                        <span>{{scope.row.user.shopCode}}</span>-->
<!--                    </template>-->
<!--                </el-table-column>-->
            </div>

            <div class="shop" v-if="listQuery.entity.user.levelId===2">
                <el-table-column align="center" label="年龄">
                    <template slot-scope="scope">
                        <span>{{scope.row.user.age}}</span>
                    </template>
                </el-table-column>
                <el-table-column align="center" label="性别">
                    <template slot-scope="scope">
                        <span>{{scope.row.user.sex}}</span>
                    </template>
                </el-table-column>
                <el-table-column align="center" label="学历">
                    <template slot-scope="scope">
                        <span>{{scope.row.user.edu}}</span>
                    </template>
                </el-table-column>
                <el-table-column align="center" label="专业">
                    <template slot-scope="scope">
                        <span>{{scope.row.user.major}}</span>
                    </template>
                </el-table-column>
                <el-table-column align="center" label="加入时间">
                    <template slot-scope="scope">
                        <span>{{parseTime(scope.row.user.joinDate)}}</span>
                    </template>
                </el-table-column>
            </div>

            <el-table-column align="center" label="注册时间">
                <template slot-scope="scope">
                    <span>{{parseTime(scope.row.user.registerTime)}}</span>
                </template>
            </el-table-column>


            <el-table-column align="center" label="状态">
                <template slot-scope="scope">
                                                <span>

                         <el-tag :type="tagTypes[scope.row.user.status]">     {{statusOptions[scope.row.user.status]}}</el-tag>

                        </span>
                </template>
            </el-table-column>


          <el-table-column align="center" label="兑费">
            <template slot-scope="scope">
                                                <span>

                         <el-tag :type="tagTypes[scope.row.user.vip]">     {{vipOptions[scope.row.user.vip]}}</el-tag>

                        </span>
            </template>
          </el-table-column>


            <el-table-column align="center" label="操作" width="300" class-name="small-padding fixed-width">
                <template slot-scope="scope">
                  <el-button v-if="canAccount" @click="handleRecharge(scope.row)" size="mini" type="warning">转账
                  </el-button>
                  <el-button @click="handleAccount(scope.row)" size="mini" type="success">账户
                  </el-button>
                  <el-button type="primary" v-if="canUpdate" size="mini" @click="handleUpdate(scope)">编辑</el-button>
                    <el-button v-if="canSave" size="mini" type="danger"
                               @click="handleDelete(scope)">删除
                    </el-button>
                </template>
            </el-table-column>

        </el-table>

        <div class="pagination-container" style="margin-top: 20px">
            <el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange"
                           :current-page="listQuery.page" :page-sizes="[10,20,30, 50]" :page-size="listQuery.limit"
                           layout="total, sizes, prev, pager, next, jumper" :total="total">
            </el-pagination>
        </div>

        <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible">
            <el-form :rules="rules" ref="dataForm" :model="temp" label-position="left" label-width="120px"
                     style='width: 450px; margin-left:50px;'>
                <el-form-item label="名称" prop="name">
                    <el-input v-model="temp.user.name"></el-input>
                </el-form-item>
                <el-form-item label="微信openid" prop="openId">
                    <el-input v-model="temp.user.openId"></el-input>
                </el-form-item>
              <el-form-item label="微信unionId" prop="openId">
                <el-input v-model="temp.user.unionId"></el-input>
              </el-form-item>
                <el-form-item label="手机号码" prop="mobile">
                    <el-input v-model="temp.user.mobile"></el-input>
                </el-form-item>
                <el-form-item label="身份" prop="levelId">
                    <el-select @change='handleFilter' clearable class="filter-item input" style="width: 130px"
                               v-model="temp.user.levelId"
                               placeholder="级别">
                        <el-option v-for="(item,index) in  levels" :key="index" :label="item.name" :value="item.id">
                        </el-option>
                    </el-select>
                </el-form-item>

                <el-form-item label="上级编号" prop="pid">
                    <el-input v-model="temp.top.code"></el-input>
                </el-form-item>


                <div class="shop" v-if="temp.user.levelId>=1">
                    <!--                <el-form-item label="省" prop="province">-->
                    <!--                    <el-input v-model="temp.province"></el-input>-->
                    <!--                </el-form-item>-->
                    <!--                <el-form-item label="市" prop="city">-->
                    <!--                    <el-input v-model="temp.city"></el-input>-->
                    <!--                </el-form-item>-->
                    <!--                <el-form-item label="县" prop="county">-->
                    <!--                    <el-input v-model="temp.county"></el-input>-->
                    <!--                </el-form-item>-->
                    <el-form-item label="省/市/县" prop="detail">
                    <el-cascader
                            :props="props"
                            v-model="address"
                            :options="addressData"
                            ></el-cascader>
                    </el-form-item>
                    <el-form-item label="详细地址" prop="detail">
                        <el-input v-model="temp.user.detail"></el-input>
                    </el-form-item>
<!--                    <el-form-item label="连锁名称" prop="linkName">-->
<!--                        <el-input v-model="temp.user.linkName"></el-input>-->
<!--                    </el-form-item>-->
                    <el-form-item label="药店名称" prop="shopName">
                      <el-select filterable @change='handleFilter' clearable class="filter-item input" style="width: 130px"
                                 v-model="temp.user.shopId"
                                 placeholder="药店">
                        <el-option v-for="(item,index) in  shops" :key="index" :label="item.shop.shopName" :value="item.shop.id">
                        </el-option>
                      </el-select>
                    </el-form-item>
                    <el-form-item label="药店代码" prop="shopCode">
                        <el-input v-model="temp.user.shopCode"></el-input>
                    </el-form-item>
                    <el-form-item label="描述" prop="info">
                        <el-input v-model="temp.user.info"></el-input>
                    </el-form-item>

                </div>




                <div class="bus" v-if="temp.user.levelId===2">

                    <el-form-item label="身份证" prop="idCard">
                        <el-input v-model="temp.user.idCard"></el-input>
                    </el-form-item>
                    <el-form-item label="年龄" prop="age">
                        <el-input v-model="temp.user.age"></el-input>
                    </el-form-item>
                    <el-form-item label="性别" prop="sex">
                        <el-input v-model="temp.user.sex"></el-input>
                    </el-form-item>
                    <el-form-item label="学历" prop="edu">
                        <el-input v-model="temp.user.edu"></el-input>
                    </el-form-item>
                    <el-form-item label="专业" prop="major">
                        <el-input v-model="temp.user.major"></el-input>
                    </el-form-item>
                    <el-form-item label="加入时间" prop="date">
                        <el-date-picker v-model="temp.user.joinDate" type="datetime"
                                        value-format="yyyy-MM-dd HH:mm:ss" placeholder="加入时间">
                        </el-date-picker>
                    </el-form-item>
                </div>

                <div v-if="temp.user.levelId>=1">
                    <el-form-item label="开户姓名" prop="bank">
                        <el-input v-model="temp.user.bankUser"></el-input>
                    </el-form-item>
                    <el-form-item label="银行账号" prop="bank">
                        <el-input v-model="temp.user.bankNum"></el-input>
                    </el-form-item>
                    <el-form-item label="开户银行" prop="bank">
                        <el-input v-model="temp.user.bankName"></el-input>
                    </el-form-item>
                    <el-form-item label="开户分行" prop="bank">
                        <el-input v-model="temp.user.bankBranch"></el-input>
                    </el-form-item>
                </div>




                <el-form-item label="状态" prop="status">
                    <el-select class="filter-item" v-model="temp.user.status" placeholder="状态">
                        <el-option v-for="(item,index) in  statusOptions" :key="item" :label="item"
                                   :value="index">
                        </el-option>
                    </el-select>
                </el-form-item>
              <el-form-item label="兑费" prop="status">
                <el-select class="filter-item" v-model="temp.user.vip" placeholder="兑费">
                  <el-option v-for="(item,index) in  vipOptions" :key="item" :label="item"
                             :value="index">
                  </el-option>
                </el-select>
              </el-form-item>
                <el-form-item label="注册时间" prop="date">
                    <el-date-picker v-model="temp.user.registerTime" type="datetime"
                                    value-format="yyyy-MM-dd HH:mm:ss" placeholder="变动时间">
                    </el-date-picker>
                </el-form-item>

<!--                <el-form-item label="营业执照" prop="shopImg">-->
<!--                    <el-upload-->
<!--                            ref="shopImgUpload"-->
<!--                            action="http://upload.qiniup.com"-->
<!--                            :auto-upload="true"-->
<!--                            list-type="picture-card"-->
<!--                            :on-preview="handlePictureCardPreview"-->
<!--                            :before-upload="handleUpload"-->
<!--                            :on-success="handleshopImgUploadSuccess"-->
<!--                            :data="qData"-->
<!--                            :file-list="shopImgList"-->
<!--                            :on-remove="handleshopImgRemove">-->
<!--                        <i class="el-icon-plus"></i>-->
<!--                    </el-upload>-->
<!--                </el-form-item>-->

                <el-dialog :visible.sync="dialogVisible" append-to-body>
                    <img width="100%" :src="dialogImageUrl" alt="">
                </el-dialog>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="closeDialogForm">取消</el-button>
                <el-button v-if="dialogStatus=='create'" type="primary" @click="createData">确认</el-button>
                <el-button v-else type="primary" @click="updateData">确认</el-button>
            </div>
        </el-dialog>

      <el-dialog :visible.sync="dialogRechargeVisible" title="转账" v-if="recharge">
        <el-card class="box-card">
          <div class="clearfix" slot="header">
            <span>人员信息</span>
            <div @click="reverse" style="display: inline-block;margin-left: 20px;color: red">
              <span>位置转换</span>
              <i class="el-icon-sort" style="margin-left: 5px;"></i>
            </div>

          </div>

          <el-form :inline="true" label-width="100px">


            <el-form-item label="转出方">
              <el-input placeHolder="编号" v-model="recharge.fromUserCode"></el-input>
            </el-form-item>
            <el-form-item label=" ">
              <el-input placeHolder="名字" v-model="recharge.fromUserName"></el-input>
            </el-form-item>


            <!--                <el-divider class="box-card"><i class="el-icon-bottom"></i></el-divider>-->
            <el-form-item label="接收方">
              <el-input placeHolder="编号" v-model="recharge.toUserCode"></el-input>
            </el-form-item>
            <el-form-item label=" " v-if="!recharge.toUserCode||recharge.toUserCode.indexOf('_')<0">
              <el-input placeHolder="名字" v-model="recharge.toUserName"></el-input>
            </el-form-item>
          </el-form>
        </el-card>

        <el-card class="box-card" style="margin-top: 24px">
          <div class="clearfix" slot="header">
            <span>转账信息</span>
            <!--                    <el-button @click="addTransfer" style="float: right; padding: 3px 0" type="text">添加</el-button>-->
          </div>
          <el-form :inline="true" label-width="50px">

            <el-form-item label="币种" prop="status">
              <el-select class="filter-item" placeholder="币种" v-model="recharge.type">
                <el-option :key="item" :label="item" :value="index"
                           v-for="(item,index) in  accountOptions">
                </el-option>
              </el-select>
            </el-form-item>


            <el-form-item label="数量">
              <el-input placeHolder="数量"
                        type="number" v-model="recharge.amount"></el-input>
            </el-form-item>


            <el-form-item label="备注">
              <el-input :rows="2" placeHolder="备注" style="width: 400px" type="textarea"
                        v-model="recharge.info"></el-input>
            </el-form-item>

          </el-form>
        </el-card>

        <span class="dialog-footer" slot="footer">
    <el-button @click="dialogRechargeVisible = false">取 消</el-button>
    <el-button @click="transfer" type="primary">确 定</el-button>
  </span>

      </el-dialog>


      <el-dialog :visible.sync="dialogAccountVisible" title="账户">
        <el-card class="box-card" style="padding-bottom: 24px;margin-top: 24px">
          <div class="clearfix" slot="header">
            <span>资金账户</span>
            <!--                    <el-button @click="addTransfer" style="float: right; padding: 3px 0" type="text">添加</el-button>-->
          </div>
          <el-table :data="accountList" border fit>
            <yf-table-column align="center" label="账户名">

              <template slot-scope="scope">
                <span>{{accountOptions[scope.row.type]}}</span>
              </template>

            </yf-table-column>
            <yf-table-column
                align="center"
                label="数量">
              <template slot-scope="scope">
                <span>{{scope.row.amount}}</span>
              </template>
            </yf-table-column>
            <yf-table-column
                align="center"
                label="冻结">
              <template slot-scope="">
                <span>0</span>
              </template>
            </yf-table-column>
          </el-table>
        </el-card>

        <span class="dialog-footer" slot="footer">
<!--    <el-button @click="dialogTransferVisible = false">取 消</el-button>-->
          <!--    <el-button type="primary" @click="transferGoods">确 定</el-button>-->
  </span>

      </el-dialog>


    </div>
</template>
<style type="stylus">
    .filter-container {
        /*padding-bottom: 20px;*/
    }

    .filter-item {
        margin-bottom: 10px;
    }

    .filter-item.input {
        /*line-height: 60px*/
        margin-right: 10px;
    }
</style>

<script>
    import {addressData} from "@/utils/area";
    import {list, down, changeVip, save, update, remove,info,transfer} from '@/api/user'
    import waves from '@/directive/waves' // 水波纹指令
    import {parseTime} from '@/utils'

    import {getToken, domain} from '@/api/qiniu'
    import {listToStrs, strsToList} from '@/utils/imgUtil'

    import {mapGetters} from 'vuex'
    import {hasAuth} from '@/utils/auth'
    import {listAll} from "@/api/level";
    import {all} from '@/api/shop'
    import {downExcel} from "@/utils/down";
    export default {
        name: 'test',
        directives: {
            waves
        },
        data() {
            return {
              accountList: [],
              dialogAccountVisible: false,
              dialogRechargeVisible: false,
              recharge: {
                fromUserName: null,
                fromUserCode: null,
                toUserName: null,
                toUserCode: null,
                amount: null,
                info: null,
                type: null,
                shops:[]
              },
              accountOptions: ["存储金", "积分"],
                props:{
                    value:'text',
                    label:'text'
                },
                levels:[],
                tableKey: 0,
                list: null,
                total: null,
                listLoading: true,
                registerTime: null
                ,
                joinDate: null
                ,
                listQuery: {
                    json:true,
                    page: 1,
                    limit: 20,
                    order: 'user.id desc',
                    entity:{
                        user:{
                            name: null
                            ,
                            avatar: null
                            ,
                            openId: null
                            ,
                            mobile: null
                            ,
                            levelId: null
                            ,
                            code: null
                            ,
                            pid: null
                            ,
                            tCode: null
                            ,
                            team: null
                            ,
                            province: null,
                            shopId: null,
                            birth: null
                            ,
                            city: null
                            ,
                            county: null
                            ,
                            detail: null
                            ,
                            linkName: null
                            ,
                            shopName: null
                            ,
                            shopCode: null
                            ,
                            info: null
                            ,
                            bank: null
                            ,
                            idCard: null
                            ,
                            age: null
                            ,
                            sex: null
                            ,
                            edu: null
                            ,
                            major: null
                            ,
                            vip:null,
                            registerTime: null,
                            registerTimes: null
                            ,
                            joinDate: null,
                            joinDates: null
                            ,
                            status: null
                        },
                        top:{}
                    }
                },
                statusOptions: ["正常", "禁用"],
                vipOptions: ["关闭", "打开"],
                tagTypes: ['info', '', 'warning', 'danger', 'warning'],
                temp:{
                    top:{
                      code:null
                    },
                    user:  {
                        id: null,
                        name: null,
                        vip: null,
                        avatar: null,
                        openId: null,
                        registerTime: null,
                        mobile: null,
                        levelId: null,
                        code: null,
                        pid: null,
                        tCode: null,
                        team: null,
                        province: null,
                        city: null,
                        county: null,
                        detail: null,
                        status: null,
                        linkName: null,
                        shopName: null,
                        shopCode: null,
                        info: null,
                        shopImg: null,
                        bankUser: null,
                        bankNum: null,
                        bankName: null,
                        bankBranch: null,
                        idCard: null,
                        age: null,
                        sex: null,
                        edu: null,
                        major: null,
                        joinDate: null
                    }
                }

                ,
                dialogFormVisible: false,
                dialogStatus: '',
                textMap: {
                    update: '修改',
                    create: '新增'
                }
                ,
                // 存在图片
                dialogImageUrl: '',
                dialogVisible: false,
                shopImgList: [],
                rules: {
                    name: [
                        {
                            required: false, message:
                                '必填字段', trigger: 'change'
                        }
                    ]
                    ,
                    avatar: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    openId: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    registerTime: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    mobile: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    levelId: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    code: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    pid: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    tCode: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    team: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    province: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    city: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    county: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    detail: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    status: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'blur'
                        }
                    ]
                    ,
                    linkName: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    shopName: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    shopCode: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    info: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    shopImg: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    bank: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    idCard: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    age: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    sex: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    edu: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    major: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                    ,
                    joinDate: [
                        {
                            required: false, message:
                                '必填字段', trigger:
                                'change'
                        }
                    ]
                }
                ,
                downloadLoading: false,
                qData:
                    {
                        token: '',
                        key:
                            ''
                    }
            }
        },
        created() {
            this.getList()
            listAll().then(res=>{
                this.levels = res.data
            })
            all().then(res=>{
              this.shops = res.data
            })
        },
        computed: {
            ...mapGetters([
                'perms'
            ]),
            addressData(){
              return addressData
            },
            address:{
              get(){
                  return [this.temp.user.province, this.temp.user.city,this.temp.user.county]
              },
              set(newVal){
                  this.temp.user.province = newVal[0]
                  this.temp.user.city = newVal[1]
                  this.temp.user.county = newVal[2]
              }
            },
            canSave() {
                return hasAuth(this.perms, 'user:save')
            },
            canDelete() {
                return hasAuth(this.perms, 'user:delete')
            },
            canUpdate() {
                return hasAuth(this.perms, 'user:update')
            },
            canAccount() {
              return hasAuth(this.perms, 'user:account')
            },
            canList() {
                return hasAuth(this.perms, 'user:list')
            }
        },
        methods: {
            parseTime(time) {
                return parseTime(time, '{y}-{m}-{d}')
            },
            getList() {
                this.listLoading = true
                list(this.listQuery).then(response => {
                    this.list = response.data.list
                    this.total = response.data.total
                    this.listLoading = false
                })
            },
            handleFilter() {
                this.listQuery.page = 1
                this.getList()
            },
            handleVip(){
                changeVip(this.listQuery).then(res=>{
                  this.getList()
                })
            },
            handleSizeChange(val) {
                this.listQuery.limit = val
                this.getList()
            },
            handleCurrentChange(val) {
                this.listQuery.page = val
                this.getList()
            },
            handleModifyStatus(row, status) {
                this.$message({
                    message: '操作成功',
                    type: 'success'
                })
                row.status = status
            },
            beforeFormShow(row) {
                this.resetTemp(row) // 更新数据
                // 存在图片
                this.initQiniu()

                // 存在图片字段转换图片地址显示
                this.initImgUrl()
            },
            afterFormShow() {

            },
            beforeFormCommit() {
                this.initImgName()// 图片转换
            },
            resetTemp(row) {

                this.temp = {}
                if (row) {
                    this.temp = JSON.parse(JSON.stringify(row))
                }

            },
            handleCreate() {
                this.beforeFormShow()
                this.resetTemp()
                this.dialogStatus = 'create'
                this.dialogFormVisible = true
                this.$nextTick(() => {
                    this.afterFormShow()
                    this.$refs['dataForm'].clearValidate()
                })
            },
            handleDelete(scope) {
                this.index = scope.$index
                // this.beforeFormShow(scope.row)
                // this.temp = Object.assign({}, row) // copy obj
                this.$confirm('此操作将永久删除该记录, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    // this.$message({
                    //   type: 'success',
                    //   message: '删除成功!'
                    // })
                    this.deleteData()
                }).catch(() => {
                    this.$message({
                        type: 'error',
                        message: '删除失败'
                    })
                })
            },
            // 显示将图片名封装成可以展示状态集合
            initImgUrl() {
                this.shopImgList = strsToList(this.temp.shopImg, domain)
            },
            // 关闭显示窗口 重置图片地址 防止错乱
            resetImgUrl() {
                this.shopImgList = []
            },
            // 上传或者更新的时候从图片链接中获取图片名字
            initImgName() {
                this.temp.shopImg = listToStrs(this.shopImgList)
            },
            createData() {
                this.$refs['dataForm'].validate((valid) => {
                        if (valid) {
                            this.beforeFormCommit()
                            save(this.temp).then(res => {
                                this.temp = res.data
                                this.list.unshift(this.temp)
                                this.closeDialogForm()
                                this.$notify({
                                    title: '成功',
                                    message: '创建成功',
                                    type: 'success',
                                    duration: 2000
                                })
                            })
                        }
                    }
                )
            },
            deleteData() {
                // const ids = [this.temp.id]
                const ids = [this.list[this.index].user.id]
                remove({ids: ids}).then(() => {
                    // 从当前队列中移除
                    this.list.splice(this.index, 1)
                    this.$notify({
                        title: '成功',
                        message: '删除成功',
                        type: 'success',
                        duration: 2000
                    })
                })
            },
          transfer() {
            transfer(this.recharge).then(res => {
              this.dialogRechargeVisible = false
              this.$notify({
                title: '成功',
                message: '转账成功',
                type: 'success',
                duration: 2000
              })
            })
          },
          reverse() {
            let code = this.recharge.fromUserCode
            let name = this.recharge.fromUserName
            this.recharge.fromUserCode = this.recharge.toUserCode
            this.recharge.fromUserName = this.recharge.toUserName
            this.recharge.toUserCode = code
            this.recharge.toUserName = name
          },
          handleAccount(row) {
            info(row.user.id).then(res => {
              this.accountList = res.extra.accounts
              this.dialogAccountVisible = true
              // console.log(this.accountList)
            })
          },
          handleRecharge(row) {
            this.recharge.fromUserCode = '00'
            this.recharge.fromUserName = '公司'
            this.recharge.toUserName = row.user.name
            this.recharge.toUserCode = row.user.code
            this.dialogRechargeVisible = true
          },
            handleUpdate(scope) {
                this.index = scope.$index
                this.beforeFormShow(scope.row)
                this.dialogStatus = 'update'
                this.dialogFormVisible = true
                this.$nextTick(() => {
                    this.$refs['dataForm'].clearValidate()
                })
            },
            updateData() {
                this.$refs['dataForm'].validate((valid) => {
                        if (valid) {
                            this.beforeFormCommit()
                            update(this.temp).then(() => {
                                // this.list.splice(this.index, 1, this.temp)
                                this.getList()
                                this.closeDialogForm()
                                this.$notify({
                                    title: '成功',
                                    message: '更新成功',
                                    type: 'success',
                                    duration: 2000
                                })
                            })
                        }
                    }
                )
            },
            closeDialogForm() {
                // 存在图片
                this.resetImgUrl()
                this.dialogFormVisible = false
            },
          handleDownload() {
            this.downloadLoading = true
            down(this.listQuery).then(res => {
              downExcel(res)
              this.downloadLoading = false
              this.$notify({
                title: '成功',
                message: '下载成功',
                type: 'success',
                duration: 2000
              })
            })
          },
            formatJson(filterVal, jsonData) {
                return jsonData.map(v => filterVal.map(j => {
                        return v[j]
                    }
                ))
            },
            // 存在图片
            handleUpload(file) {
                this.qData.key = new Date().valueOf() + file.name
            },
            initQiniu() {
                // 获取七牛配置
                getToken().then(res => {
                    this.qData.token = res.data
                }).catch(error => {
                    console.log(error)
                })
            },
            handleshopImgUploadSuccess(response, file) {
                this.shopImgList.push({name: file.response.key, url: domain + file.response.key})
            }
            ,
            handleshopImgRemove(file) {
                for (var fn of this.shopImgList) {
                    if (fn.name === file.name) {
                        this.shopImgList.splice(this.shopImgList.indexOf(fn), 1)
                    }
                }
            },
            handlePictureCardPreview(file) {
                this.dialogImageUrl = file.url
                this.dialogVisible = true
            }
        }
    }
</script>
